@import './constatnt.less';

:global {
  // color
  .c-green {
    color: @c-green;
  }
  
  .c-red {
    color: @c-red;
  }
  
  // margin
  .mt10 {
    margin-top: 10px;
  }
  
  .mt20 {
    margin-top: 20px;
  }
  
  .mb10 {
    margin-bottom: 10px;
  }
  
  .mb20 {
    margin-bottom: 20px;
  }
  
  .ml10 {
    margin-left: 10px;
  }
  
  .mr10 {
    margin-right: 10px;
  }
  
  .mr120 {
    margin-right: 120px;
  }
  
  // width
  .w100px {
    width: 100px;
  }
  
  .w-100percent {
    width: 100%;
  }
  
  .w-vw100 {
    width: 100vw;
  }
  
  // height
  .h-100percent {
    height: 100%;
  }
  
  .h-vh100 {
    height: 100vh;
  }
  
  // flex 左右垂直居中
  .f-vhc {
    display: flex;
    justify-content: center;
    align-items: center;
  }
  // flex 左右水平居中
  .f-hc {
    display: flex;
    justify-content: center;
  }
  
  // float
  .fl-l {
    float: left;
  }
  
  .fl-r {
    float: right;
  }
  
  // display
  .display-none {
    display: none;
  }
  
  // position
  .pos-r {
    position: relative;
  }
  
  .pos-a {
    position: absolute;
  }
  
  .pos-f {
    position: fixed;
  }
  
  // white-space
  .ws-nowrap {
    white-space: nowrap
  }
  
  .ws-normal {
    white-space: normal
  }
  
  // text-align
  .txt-a-c {
    text-align: center;
  }
  
  .txt-a-l {
    text-align: left;
  }
  
  .txt-a-r {
    text-align: right;
  }
  
  // overflow
  .ovf-h {
    overflow: hidden;
  }
  
  .ovf-s {
    overflow: scroll;
  }
  
  .ovf-a {
    overflow: auto;
  }
}
